<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    <div class="div1">1</div>
    <div class="div1" id="div2">2</div>
    <div class="div1">3</div>
    <div class="div1">4</div>
    <script>
        // html5 (不是特指标签)（还包括了一些js代码）
        // 获取元素的方法   （3种）
        // Tag 标签
        // document.getElementsByTagName

        // 通过类名获取
       var a= document.getElementsByClassName('div1');
       console.log(a);
       // 获取到的还是一个伪数组
       // 我们获取元素 只要是多个  就返回伪数组

       // 第二种
       // query 查询
       // Selector  选择器
       // 获取到选择器为。。。 的第一个元素
       // 注意选择器  的. 和 #  如果不匹配 返回null
       var b=document.querySelector('div');
       console.log(b);

       // 第三种
       // node  节点   list 集合
       // 始终返回一个伪数组  即使没找到也是空的伪数组
       var c=document.querySelectorAll('.div1');
        console.log(c);
    </script>
</body>
</html>